<template>
	<panel v-bind:hasHeader="false">
		<template slot="content">
			<div class="flex-cnt-btwn">
				<div>
					<h1>似乎出了点问题...</h1>
					<p>似乎出了点问题</p>
					<div>
						<a v-on:click="reload">重新加载</a>
						<a v-on:click="ignore">忽略</a>
					</div>
				</div>
				<img src="./images/network_error.png" alt="">
			</div>
		</template>
	</panel>
</template>
<script>
	import Panel from 'CommonComponent/panel';
	export default {
		name: 'network-error',
		components: {
			'panel': Panel
		},
		methods: {
			reload () {
				this.$emit('reload');
			},
			ignore () {
				this.$emit('ignore');
			}
		}
	}
</script>
<style lang="less" scoped>
	h1 {
		color: #1180DB;
		font-size: 18px;
		margin-bottom: 5px;
	}
	
	p {
		margin-bottom: 25px;
	}

	a {
		color: #1180DB;
		font-size: 12px;
		&:first-child {
			margin-right: 30px;
		}
	}

	img {
		width: 140px;
		height: auto;
		margin-right: -14px;
	}
</style>

